<template>
  <div class="hello">
    <section>
      <router-view></router-view>

    </section>
    <footer>
      <router-link to="/silkbag" tag="p"><i class="iconfont icon-jinnang-"></i><span>锦囊</span></router-link>
      <router-link to="/life" tag="p"><i class="iconfont icon-shenghuo-"></i><span>生活</span></router-link>
      <router-link to="/timenotes" tag="p"><i class="iconfont icon-shiguang"></i><span>时光记</span></router-link>
      <router-link to="/news" tag="p"><i class="iconfont icon-xiaoxi"></i><span>消息</span></router-link>
      <router-link to="/user" tag="p"><i class="iconfont icon-wodedangxuan"></i><span>我的</span></router-link>
    </footer>
  </div>
</template>

<script>
import Silkbag from './Silkbag'

export default {
  name: 'HelloWorld',
  data () {
    return {
    }
  },
  components:{
   
  },
  methods: {
  },
}
</script>

<style scoped>
	*{
  	font-size: 14px!important;
  }
  .hello{
    height:100vh;
    display: flex;
    flex-direction: column;
  }
  footer{
    height: 45px;
    background: #56A5E8;
    text-align: center;

  } 
  section{
    flex: 1
  }
  footer{
    display: flex;
    position: fixed;
    bottom: 0px;
    width: 100%;
  
  }
  footer p{
    flex: 1;
    
    margin-top: 8px;
  }
  .router-link-active{
    color: white
  }
  p{
    display: flex;
    flex-direction: column;
  }
  i{
    font-size: 16px !important;
  }
  p span{
    font-size: 12px !important;
  }
</style>
